/* 
    Document   : style
    Created on : Apr 8, 2011, 3:21:41 PM
    Author     : HungXD
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

* {
    margin:0;
    padding:0;
}
li {
    list-style: none;
}
a {
    text-decoration: none;
    color:#333333;
}
table tr td {
    font-size:11px;
}
input[type=text],input[type=password] {
    border:1px solid #cecece;    
    height:17px;
    font-size: .9em;
    width: 200px;
}
textarea {
    border:1px solid #cecece;
}
input:hover {
    background:#e5fdcd;
}
select {
    border:1px solid #cecece;    
    font-size: 1em;
    height:18px;
    width:150px;
}
.enter {
    color:#f55e35;
}
body {
    font-family: arial;
    font-size:68.5%;
    color:#333333;    
}
#wrapper {
    margin: 0 auto;
    width:1000px;
    display:block;
    height:auto;
    min-height: 500px;
    -moz-box-shadow: 0 0 5px #777;
    -webkit-box-shadow: 0 0 5px #777;
    box-shadow: 0 0 5px #777;
}
/****BANNER*****/
#banner {
    margin-top:10px;
    height:50px;
    background: url("../Images/banner.png") repeat-x;
    position:relative;
}
#banner div#logo {
    position: absolute;
    top:5px;
    left:10px;    
}
#banner div#logo a{    
    font-size:18px;
    color:#fff;
    font-weight: bold;
}
#banner div#logo a:hover {
    text-decoration: underline;
}
/****MENU*****/
#menu {
    width:1000px;
}
#menu ul {
    float:left;
    width:1000px;
    height:23px;
    background: #fff;
    -moz-box-shadow: 0 0 5px #777;
    -webkit-box-shadow: 0 0 5px #777;
    box-shadow: 0 0 5px #777;
}
#menu ul li {
    float:left;
    position:relative;
}
#menu ul li a {
    display:block;
    font-size:11px;
    font-weight:bold;
    color:#333;
    padding:5px 20px;
    border-left: 1px solid #cecece;
}
#menu ul li a:hover{
    color: #666666;
}
#menu ul li ul {
    width:170px;
    height:auto;
    position: absolute;
    z-index: 1;
    display:none;
}
#menu ul li:hover ul {
    display:block;
}
#menu ul li ul li{
    position: relative;
    width: 170px;
    border-bottom: 1px solid #cecece;
}
#menu ul li ul li:last-child {
    border:none;
}
#menu ul li ul li a {
    padding-left:26px;
}
#menu ul li ul li img {
    float: left;
    position: absolute;
    top:3px;
    left:3px;    
    border-right: 1px solid #cecece;
}
#menu ul li ul li ul.submenu{
    position:absolute;
    top:0px;
    left:100%;
    display:none;
}
#menu ul li ul li:hover ul.submenu {
    display:block;
}
/***PANEL*****/
#panelNav {
    clear:both;
    margin:5px 15px;
    padding:4px;
    background:#f4f4f4;
    border:1px solid #cecece;
    position:relative;
    height:58px;
    line-height: 58px;
}
#panelNav ul {
    float:right;
}
#panelNav ul li {
    float:right;
}
#panelNav ul li a {
    display:block;
    padding-bottom: 6px;
    padding-left: 6px;
    padding-right: 6px;
    padding-top: 16px;
    line-height: 40px;
    font-size:12px;
    font-weight: bold;
    color:#3f6cd3;
}
#panelNav ul li a:hover{
    text-decoration: underline;    
}
/****TASKNAV*****/
#taskNav {        
    clear:both;
    margin:34px 15px 15px 15px;
    padding:4px;
    background:#f4f4f4;
    border:1px solid #cecece;
    position:relative;
    height:20px;
    line-height: 20px;
}
#taskNav ul {
    float:left;

}
#taskNav ul li{
    float:left;
    color:#000;
    padding-left:10px;
}
#taskNav ul li img {
    position: relative;
    top:3px;
}
/******MENU CHUC NANG*****/
#panelNav div#logo-featured {
    float:left;
    width:500px;
}
#panelNav div#logo_featured img {
    position: absolute;
    top:1px;
    left:3px;
}
#panelNav div#logo-featured span {
    position: absolute;
    padding-left: 15px;
    font-size: 20px;
    font-weight: bold;  
}
/****CONTENT****/

#main-container {
    height:auto;
    min-height: 380px;
    background:#f4f4f4;
    border:1px solid #cecece;
    margin:34px 15px;
}
#main-container div#filter-bar {
    height:40px;
    border:1px solid #cecece;
    margin:5px 5px;
}
#main-container div#filter-bar form {
    margin:10px;
}
/*****TABLE*****/
.mytable {
    width: 99%;
    padding: 0;
    border-collapse: collapse;
    border:1px solid #CAE8EA
}

caption {
    padding: 0 0 5px 0;
    width: 700px;
    font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    text-align: right;
}

.mytable th {
    font-size:9px;
    color: #4f6b72;
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    border-top: 1px solid #C1DAD7;
    text-transform: uppercase;
    text-align: center;
    padding: 6px 6px 6px 12px;
    background: #CAE8EA url(../Images/bg_header.jpg) no-repeat;
}

.mytable th.nobg {
    border-top: 0;
    border-left: 0;
    border-right: 1px solid #C1DAD7;
    background: none;
}

.mytable td {
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    background: #fff;
    padding: 6px 6px 6px 6px;
    color: #4f6b72;
    font-size:12px;
    text-align: center;
}


.mytable td.alt {
    background: #F5FAFA;
    color: #797268;
}

.mytable td.spec {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #fff url(../Images/bullet11.gif) no-repeat;
    font-size:10px;
}

.mytable td.specalt {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #f5fafa url(../Images/bullet12.gif) no-repeat;
    font-size:10px;
    color: #797268;
}
/****DASHBOARD****/
#cpanel-left {
    float:left;
    width:570px;
    height:auto;    
    margin:10px;
}
div.icon {
    padding:5px;
    float:left;
    border:1px solid #cecece;
    background:#fff;
    margin-left:10px;
    margin-top: 10px;
}
div.icon:hover {
    -moz-box-shadow: 0 0 3px #888;
    -webkit-box-shadow: 0 0 3px #888;
    box-shadow: 0 0 3px #888;
}
div.icon a{
    display:block;    
}
div.icon span {
    padding-left: 10px;
}
#cpanel-right {
    float:left;
    margin:15px;
    width:340px;
}
/*****STYLE LOGINFORM******/
#login-form {
    margin:20px 28%;
    height:250px;
    width:450px;
    border:1px solid #cecece;
    position: relative;
}
#login-form div.t {
    margin:5px;
    font-size: 18px;
    color:#3780e7;
    font-weight: bold;
}
#login-form div#login-left {
    float:left;
    width:130px;
}
#login-form div#login-left img{
    margin-left: -20px;
}
#login-form div#login-right {
    float:left;
    width:280px;
    border:1px solid #cecece;
    margin-top:10px;
}
#login-form table {
    margin:10px;
    font-size:.9em;
}
/****STYLE FIELDSET FORM*****/
.create-form {
    /*    float:left;*/
    width:550px;
    border:1px solid #cecece;
    background:#fff;
    font-size:.9em;
    margin:10px;
}
.create-form legend {
    color:#3780e7;
    font-weight: bold;
    font-size:1.4em;
    margin-left: 10px;
}
.create-form table {
    margin:15px;
    font-size:1.1em;
}
.create-form table tr td span {
    color:#e26027;
}
/*****PAGING*****/
.paging span {
    margin-left:5px;
}
.paging span#current_page {
    padding:5px 10px;
    border:1px solid #cecece;
    background:#AF2020;
    color:#fff;
    font-weight: bold;
    -moz-border-radius:4px;
}
.paging span#current_page:hover {
    -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px#888;
    box-shadow: 0 0 5px #888;
}
.paging span#link_dif a {
    padding:5px 10px;
    border:1px solid #cecece;
    color:#444444;
    background:#CAE8EA;
    color:#777777;
}
.paging span#link_dif a:hover {
    -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px#888;
    box-shadow: 0 0 5px #888;
}
.paging span.first_page a {
    padding:5px 10px;
    border:1px solid #cecece;
    color:#444444;
    background:#CAE8EA;
    color:#777777;
}
.paging span.last_page a {
    padding:5px 10px;
    border:1px solid #cecece;
    color:#444444;
    background:#CAE8EA;
    color:#777777;
}
.paging span.next_page a {
    padding:5px 10px;
    border:1px solid #cecece;
    color:#444444;
    background:#CAE8EA;
    color:#777777;
}
.paging span.prev_page a {
    padding:5px 10px;
    border:1px solid #cecece;
    color:#444444;
    background:#CAE8EA;
    color:#777777;
}
.category li {
    padding:5px 15px;
    background: url("../Images/line1.gif") no-repeat;
}
/****STYLE IMG******/
.img-item {
    float:left;
    width:70px;
    display:block;
    margin:5px;
    padding:5px;
    /*    border:1px solid #cecece;*/
    -moz-box-shadow: 0 0 8px #c0eafc;
    -webkit-box-shadow: 0 0 8px #c0eafc;
    box-shadow: 0 0 5px #c0eafc;
}
.img-border{
    padding: 5px;
    border:1px solid #ccc;
}
.error {
    border: 1px solid #f00;
}
							